<template>
	<view>
		<!-- 可以添加一个按钮触发下载 -->
		<button @click="downloadImage">下载并预览图片</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imageURL: 'https://cdn.pixabay.com/photo/2025/11/05/20/57/monastery-9939590_1280.jpg', // 需填写要下载的图片URL
				iconFilePath: '' // 用于存储下载后的临时路径
			}
		},
		methods: {
			// 下载图片的方法（需包裹在方法内，不能直接写在methods根节点）
			downloadImage() {
				// 检查imageURL是否为空
				if (!this.imageURL) {
					console.error('请先设置图片URL');
					return;
				}
				
				// 发起下载请求
				const imagetask = uni.downloadFile({
					url: this.imageURL, // 要下载的图片地址
					success: (res) => {
						if (res.statusCode === 200) {
							console.log('下载成功');
							// 预览下载的图片
							uni.previewImage({
								urls: [res.tempFilePath] // 预览的图片路径数组
							});
							// 保存临时路径
							this.iconFilePath = res.tempFilePath;
						} else {
							console.error('下载失败，状态码：', res.statusCode);
						}
					},
					fail: (err) => {
						console.error('下载失败:', err);
					},
				});
				
				// 监听下载进度（修正括号和语法错误）
				imagetask.onProgressUpdate((res) => {
					console.log('下载进度:', res.progress + "%");
					console.log('已下载:', res.totalBytesWritten);
					console.log('总大小:', res.totalBytesExpectedToWrite);
				}); // 修正此处的闭合符号（原为};，改为})
			}
		}
	}
</script>

<style>
</style>